/*
 * @Author: xiaosihan 
 * @Date: 2024-08-11 23:06:26 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-09-22 21:56:26
 */

import { Modal } from "antd";
import { isEmpty } from "lodash";
import { autorun } from "mobx";
import { ReactNode, useEffect, useState } from "react";
import styles from "./fileLookModal.module.less";
import fileLookModalStore from "./fileLookModalStore";
import utils from "@utils";

interface Iprops {
    children?: ReactNode
}

// 文件查看弹窗
export default function FileLookModal() {
    const [path, setPath] = useState(fileLookModalStore.path);

    useEffect(() => autorun(() => {
        setPath(fileLookModalStore.path);
    }), []);

    return (
        <Modal
            title=""
            centered={true}
            width={800}
            open={!isEmpty(path)}
            footer={false}
            destroyOnClose={false}
            onCancel={() => {
                fileLookModalStore.setPath("");
            }}
        >
            {
                ["png", "jpg", "jpeg", "webp"].includes(utils.getSuffix(path)) &&
                <img src={path} alt="" className={styles.img} />
            }
            {/* <iframe src={path} className={styles.iframe} ></iframe> */}
        </Modal>
    );

}